<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>修改界面</title>
<script type="text/javascript" src="js/vue.min.js" charset="utf-8"></script>
<script type="text/javascript" src="js/vue-resource.min.js" charset="utf-8"></script>
</head>
<body>
	<div id="box01">
<form action="#" >
	输入你要修改的编号:<input type="text" v-model="id"><br>
	用户名:<input type="text" v-model="user"/><br />
	密码:<input type="password" v-model="password"/><br />
	<input type="submit" value="修改" @click="Update()"/>
</form>
</div>
</body>
<script>
	var vm = new Vue({
		el:"#box01",
		data:{
			id:'',
			user:'',
			password:''
		},
		methods:{
			Update(){
				/* 服务器(tomcat) 上LoginServlet的访问,访问过程中完成参数的传递
					This.$http.get('url',[options]).then(successCallBack,errorCallBack)
				 */
				 /* this代表的是 vm */
				this.$http.get('UpdateServlet',{
				/* params 给地址栏拼接参数  等价于下面代码?后面的
					   http://localhost:8080/Ausersystem/LoginServlet?username=tom&pass=123456
					    		
					    ?后面的是拼接参数的       请求地址栏传参  
				*/
				params:{
					userid:this.id,
					username:this.user,
					pass:this.password
				    }
				/* 成功返回的回调函数  */
				}).then(function(obj){
					/* data 代表数据转换,和vue中的 data 不是一回事情 */
					/* 不管成功还是失败     只要有相应就执行   */
					alert('*****哈哈*****'+obj.data.msg);
					/* 失败之后返回的回答函数  */
					/* 没有相应就执行  */
				},function(){
					alert('嘻嘻');
				});
			}
		}
	});
</script>
</html>